<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html>
<head>
    <title>支付成功</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <base href="http://localhost/campus/">
    <link rel="shortcut icon" href="static/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" type="text/css" href="layui/css/layui.css"/>
    <link rel="stylesheet" type="text/css" href="static/css/main.css"/>
    <script src="static/js/jquery.min.js"></script>
    <script src="layui/layui.js" charset="utf-8"></script>
</head>
<body>
<div class="layui-fluid">
    <jsp:include page="/pages/common/header.jsp"/>
    <%--主体内容--%>

    <div id="content_body" class="layui-row" style="width: 100%;height:63%;padding-top: 3%">
        <div style="width: 50%;height: 90%;border-radius: 5px;background: #F2F2F2;margin: 0 auto;">
            <div style="display: flex;width: 50%;padding-left: 26%;margin: auto;text-align: center;padding-top: 60px">
                <i class="layui-icon"
                   style="font-size: 32px;color: ${message == null ? "green" : "red"}">${message== null ? "&#x1005;" : "&#x1007;"}</i>
                <h3 style="padding-left: 18px;font-size: 24px;line-height: 30px;">${message!= null ? message : "支付成功"}</h3>
            </div>
            <div style="display: flex;font-size: 15px;">
                <div class="order_payment_detail_item" style="text-align: right;padding-right: 10px;">
                    <span>订单ID:</span>
                    <span>支付方式:</span>
                    <span>收件人:</span>
                    <span>支付时间:</span>
                </div>
                <div class="order_payment_detail_item" style="padding-left: 2px;">
                    <span>${order.orderId}</span>
                    <span>${order.purchaseWay==0?"支付宝":"微信"}</span>
                    <span>${order.purchaseUserName}</span>
                    <span>${order.stringPurchaseTime}</span>
                </div>
            </div>
            <div style="width: 100%;text-align: center;padding: 42px 34px;">
                <p><span id="time" style="color: #fca130">10</span>秒之后，将自动跳转到首页，如未跳转请<a href="http://localhost/campus/product/list" style="color: deepskyblue">手动点击</a></p>
            </div>
        </div>
    </div>
    <%@include file="/pages/common/footer.jsp" %>
</div>
<script>
    //注意：导航 依赖 element 模块，否则无法进行功能性操作
    layui.use('element', function () {
        var element = layui.element;
        setInterval('updateTime()', 1000);
    });

    let time = 9;

    function updateTime() {
        $("#time").text(time);
        time--;
        if (time === 0) {
            window.location.href = "http://localhost/campus/product/list";
        }
    }

</script>
</body>
</html>
